<html>
	<header>
		<meta charset="utf-8">
	    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	    <meta name="description" content="">
	    <meta name="author" content="">
		 <title>Administraci&oacute;n de roles</title>
	</header>
	<head>
		<!--  CSS va aqui -->
		<link rel="stylesheet" type="text/css" href="../css/header_principal.css" />
		<link rel="stylesheet" href="../css/bootstrap-responsive.css" type="text/css" media="screen" title="no title" charset="utf-8">
		<link rel="stylesheet" href="../css/bootstrap.css" type="text/css" media="screen" title="no title" charset="utf-8">
		<link rel="stylesheet" href="../css/welcome_style.css">
		<link rel="Stylesheet" href="../css/theme/jquery-ui-1.10.2.custom.css" />
		<link rel="image" href="../img/portal.ico">
	    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
	    <!--[if lt IE 9]>
	      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
	    <![endif]-->

	     <!-- navBar -->
	    <div id="navG" class="navbar navbar-fixed-top">
	      
	    </div> <!-- /navBar -->
	</head>
	<body>
		<button id="newuser" class="btn" style="width:100%; position:fixed;top:40px; height:60px; font-size: 15px; font-family: Verdana;font-weight:bold">Nuevo Rol</button>
		
		<!--grid-->
		<div id="gridTable" style="padding-top:40px;">
			
		</div>
		
		<!--dialog div-->
		<div id="dialog" title="Selecciona los permisos" style="display: none;">
			<br>
			<span style="position:absolute; left:75px; ">
				<label for="Name">Nombre del rol</label>
				<input id="Name" type="text"/>
			</span>
			<br>
			<span style="position:absolute; left:400px; ">
				Activo <input type="checkbox" id="Activo" name="Activo"/>
			</span>
			<span style="position:absolute;left:75px; top:120px; ">
				<label for="Uploads">Carga de archivos</label>
				<select id="Uploads" >
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>
			<span style="position:absolute;left:400px; top:120px; ">
				<label for="Classrooms">B&uacute;squeda de salones</label>
				<select id="Classrooms">
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>
			<span style="position:absolute;left:75px; top:220px; ">
				<label for="Teachers">B&uacute;squeda de profesores</label>
				<select id="Teachers">
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>
			<span style="position:absolute;left:400px; top:220px; ">
				<label for="Courses">B&uacute;squeda de materias</label>
				<select id="Courses">
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>	
			<span style="position:absolute;left:75px; top:320px; ">
				<label for="Users">Usuario</label>
				<select id="Users">
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>
			<span style="position:absolute;left:400px; top:320px; ">
				<label for="Roles">Roles</label>
				<select id="Roles">
					<option value="N">Sin acceso</option>
					<option value="R">Solo Lectura</option>
					<option value="W">Lectura y Escritura</option>
				</select>
			</span>		
			<div style="bottom:0px;position:absolute;width:700px;border-top: 1px solid;padding-top:5px">
				<div id="message" class="alert" style="width: 460px;display:inline-block;visibility:hidden;">
					**MENSAJE**
				</div>
			
				<div style="display:inline-block;">
					<button id="cancel" style ="top:5px;"class="btn inline">Cancelar</button>
					<button id="save" style ="top:5px"class="btn inline">Guardar</button>
				</div>
				</div>
			</div>
		</div>


		<div id="deleteDialog" title="Eliminaci&oacute;n de rol" style="display: none; ">
			<br>
			<span style="position:absolute; left:75px; ">
				<p id="deleteMessage">Est&aacute; seguro de que desea eliminar el rol:  </p>
				<button id="yes" style ="top:5px" class="btn inline">Si</button>
				<button id="no" style ="top:5px" class="btn inline">No</button>
			</span>
		</div>

		<script src="../js/lib/require-jquery.js"></script>
		<script type="text/javascript">
	      require(['../js/common/common'], function (common) {
	        require(['main-permissions']);
	      });
	    </script>
	</body>
</html>